<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        
    </style>
</head>
<body>
    <ul class="list">
        <li>link1</li>
        <li>link2</li>
        <li>link3</li>
        <li>link4</li>
        <li>link5</li>
        <li>link6</li>
    </ul>
</body>
<script>

    // 循环中，绑定事件，事件内，获取循环每次的计数器

    const lis = document.querySelectorAll(".list li")

    // 问题：循环中，绑定事件，事件内，无法获取循环每次的计数器
    // for(var i=0;i<lis.length;i++){
    //     lis[i].onclick = function(){
    //         console.log(i);
    //     }
    // }

    // 解决：利用闭包
    // for(var i=0;i<lis.length;i++){
    //     // 2. 函数外部有变量接收这个复杂数据
    //     ;const f = (function(a){
    //         // 1. 函数内部返回一个复杂数据
    //         return function(){
    //             console.log(a);
    //         }
    //     })(i);
    //     lis[i].onclick = f;
    // }

    // for(var i=0;i<lis.length;i++){
    //     lis[i].onclick = (function(a){
    //         return function(){
    //             console.log(a);
    //         }
    //     })(i);
    // }
    
    // for(var i=0;i<lis.length;i++){
    //     ;(function(a){
    //         lis[a].onclick = function(){
    //             console.log(a);
    //         }
    //     })(i);
    // }

    // for(let i=0;i<lis.length;i++){
    //     lis[i].onclick = function(){
    //         console.log(i);
    //     }
    // }



    // =========



    // 给不能传参的内置方法的回调函数传参
    // 给一份好看的好吃的红烧肉拍照

    // setTimeout(fn("world"), 1000);
    // function fn(a){
    //     return function(){
    //         console.log(a);
    //     }
    // }


    // ==========


    // 给事件处理函数传参

    // document.onclick = fn("world");
    // function fn(a){
    //     return function(){
    //         console.log(a);
    //     }
    // }


        






</script>
</html>